<template>
	<view class="wrapper ">
		<view class="success">
			<view class="success-icon main-flex">
				<uni-icons type="checkbox" size="160" color="#e3230e"></uni-icons>
			</view>
			<view class="success-title">订单支付成功</view>
			<view class="success-info">
				<view class="success-info-item main-flex">
					<view class="success-info-item-name">支付方式：</view>
					<view class="success-info-item-text">{{payName}}</view>
				</view>
				<view class="success-info-item main-flex">
					<view class="success-info-item-name">订单金额：</view>
					<view class="success-info-item-text">￥{{money}}</view>
				</view>
			</view>
			<view class="success-btns main-flex">
				<button class="ty-button ty-button-confirm success-btns-item" @click="goOrder">查看订单</button>
				<button class="ty-button ty-button-cancel success-btns-item" @click="goHome">返回首页</button>
			</view>
		</view>
	</view>
</template>

<script setup>
import { computed, onMounted, ref, watch, nextTick } from 'vue';
import { onReady, onLoad, onReachBottom, onShow, onHide } from '@dcloudio/uni-app';
import useUserStore from '@/store/modules/user'
import useSetStore from '@/store/modules/set'
import { throttle, debounce } from '@/uni_modules/uview-plus'
import { payQuery } from "@/api/app_api/order"
import modal from '@/plugins/modal'

	const userStore = useUserStore()
	const setStore = useSetStore()
	
	const pay = ref({})
	const orderNumber = ref('')
	const orderId = ref('')
	const payName = ref('')
	const money = ref('')
	const paymentId = ref('')
	// 支付信息
	const getOrderPay = () => {
		payQuery({
			orderNumber: orderNumber.value
		}).then(res => {
			pay.value = res.data
		})
	}
	// 返回首页
	const goHome = () => {
		uni.switchTab({
			url: '/pages/index/index'
		})
	}
	// 查看详细
	const goOrder = () => {
		uni.navigateTo({
			url: `/pages/order/detail?id=${orderId.value}`
		})
	}
	onLoad((option) => {
		if (option.pId) {
			paymentId.value = option.pId
		}
		if (option.orderId) {
			orderId.value = option.orderId
		}
		if (option.name) {
			payName.value = option.name
		}
		if (option.money) {
			money.value = option.money
		}
		if (option.orderNumber && (paymentId.value == 4 || paymentId.value == 5 || paymentId.value == 6)) {
			orderNumber.value = option.orderNumber
			getOrderPay()
		}
	})
	
</script>

<style lang="scss">
	.success {
		padding: 20rpx;
		&-icon {
			justify-content: center;
		}
		&-title {
			font-size: 40rpx;
			font-weight: 600;
			margin-top: 30rpx;
			text-align: center;
		}
		&-info {
			margin-top: 20rpx;
			&-item {
				font-size: 28rpx;
				justify-content: center;
				margin-bottom: 10rpx;
				&-name {
					
				}
				&-text {
					color: $primary-color;
				}
			}
		}
		&-btns {
			margin-top: 30rpx;
			flex-direction: column;
			&-item {
				width: 400rpx;
				height: 68rpx;
				border-radius: 34rpx;
				justify-content: center;
				font-size: 24rpx;
				text-align: center;
				margin-bottom: 20rpx;
			}
		}
	}
</style>
